<template>
	<div id="wrapper">
		<img id="logo" :src="logo" alt="electron-vue"/>
		<main>
			<div class="left-side">
        <span class="title">
          我是登陆页
        </span>
			</div>

			<div class="right-side">
				<div class="doc">
					<div class="title alt">
						<el-button @click="goTo('/dashboard')">Dashboard</el-button>
						<el-button @click="goTo('/ctms')">CTMS</el-button>
					</div>
				</div>
			</div>
		</main>
	</div>
</template>

<script lang="ts" setup>
import logo from "@renderer/assets/logo.png";
import {IpcChannel, invoke, vueListen} from "@/utils/ipcRenderer";

invoke(IpcChannel.GetStaticPath).then((res) => {
	console.log("staticPath", res);
})

function goTo(page: string) {
	let data = {
		url: page,
	};
	invoke(IpcChannel.OpenWin, data);
}

</script>

<style>
* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

body {
	font-family: "Source Sans Pro", sans-serif;
}

#wrapper {
	padding: 114px 80px;
}

#logo {
	height: auto;
	margin-bottom: 20px;
	width: 420px;
}

main {
	display: flex;
	justify-content: space-between;
}

main > div {
	flex-basis: 50%;
}

.left-side {
	display: flex;
	flex-direction: column;
}

.welcome {
	color: #555;
	font-size: 23px;
	margin-bottom: 10px;
}

.title {
	color: #2c3e50;
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 6px;
}

.title.alt {
	font-size: 18px;
	margin-bottom: 10px;
}

.doc {
	margin-bottom: 10px;
}

.doc p {
	color: black;
	margin-bottom: 10px;
}

.btu {
	display: inline-block;
	line-height: 1;
	white-space: nowrap;
	cursor: pointer;
	color: #fff;
	background-color: #409eff;
	border: 1px solid #409eff;
	text-align: center;
	box-sizing: border-box;
	outline: none;
	transition: .1s;
	font-weight: 500;
	padding: 12px 20px;
	font-size: 14px;
	border-radius: 4px;
}

.btu:focus,
.btu:hover {
	background: #3a8ee6;
	border-color: #3a8ee6;
}

.doc > button {
	margin-left: 0;
}

.doc > button {
	margin-top: 10px;
	margin-right: 10px;
}

.content {
	text-align: center;
}
</style>
